<span page-title ng-model="environment">{{ 'Lifecycle Environment:' | translate }} {{ environment.name }}</span>

<div data-extend-template="layouts/details-page-with-breadcrumbs.html">
  <header data-block="header">
    {{ environment.name }}
  </header>

  <div data-block="item-actions">
    <button ng-show="!environment.library"
            ng-click="remove(environment)"
            type="button"
            class="btn btn-default">
      <span translate>Remove Environment</span>
    </button>
  </div>

  <nav data-block="navigation">
    <ul class="nav nav-tabs details-nav">
      <li ng-class="{active: isState('environment.details')}">
        <a ui-sref="environment.details({environmentId: environment.id})">
          <span translate>Details</span>
        </a>
      </li>

      <li ng-repeat="type in contentTypes" ng-class="{active: isState('environment.' + type.state)}"
          ng-show="type.repositoryType == undefined || repositoryTypeEnabled(type.repositoryType)">
        <a ng-href="{{ $state.href('environment.' + type.state, {environmentId: environment.id}) }}">
          <span translate>{{ type.display }}</span>
        </a>
      </li>
    </ul>
  </nav>

  <section data-block="content">
    <div ui-view></div>
  </section>
</div>
